import { readRoleNodes } from '@/api/identity/admin/role';
import { readEntityInfoNodes } from '@/api/authorization/admin/entityinfo';
import { getDataAuthOperationEnumSchema } from '@/enums/dataAuthOperationEnum';
import { AdColumn } from '@/components/AdTable';
import { useI18n } from '@/hooks/web/useI18n';

const { t } = useI18n();
const dataAuthOperationEnumSchema = getDataAuthOperationEnumSchema();

export const columns: AdColumn[] = [
  {
    title: t('entity.idTitle'),
    dataIndex: 'Id',
    width: 180,
    ifShow: false,
    defaultHidden: true,
    formVisible: true,
    formEditable: false,
    filterable: false,
    dataType: 'integer',
  },
  {
    title: t('routes.system.authorization.roleEntity.roleIdTitle'),
    dataIndex: 'RoleId',
    width: 200,
    defaultHidden: true,
    formVisible: true,
    formEditable: true,
    filterable: true,
    required: true,
    dataType: 'integer',
    editComponent: 'ApiSelect',
    editComponentProps: {
      api: readRoleNodes,
      // use name as label
      labelField: 'Name',
      // use id as value
      valueField: 'Id',
      showSearch: true,
      filterOption: (input: string, option: any) => {
        return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
      },
      optionFilterProp: 'Name',
      // not request untill to select
      immediate: true,
      onChange: (_e: any) => {
        // console.log('selected:', e);
      },
    },
  },
  {
    title: t('routes.system.authorization.roleEntity.roleNameTitle'),
    dataIndex: 'RoleName',
    width: 200,
    formVisible: false,
    formEditable: false,
    filterable: false,
    dataType: 'string',
  },
  {
    title: t('routes.system.authorization.roleEntity.entityIdTitle'),
    dataIndex: 'EntityId',
    width: 300,
    defaultHidden: true,
    formVisible: true,
    formEditable: true,
    filterable: true,
    required: true,
    dataType: 'integer',
    editComponent: 'ApiSelect',
    editComponentProps: {
      api: readEntityInfoNodes,
      // use name as label
      labelField: 'Name',
      // use id as value
      valueField: 'Id',
      showSearch: true,
      filterOption: (input: string, option: any) => {
        return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
      },
      optionFilterProp: 'Name',
      // not request untill to select
      immediate: true,
    },
  },
  {
    title: t('routes.system.authorization.roleEntity.entityNameTitle'),
    dataIndex: 'EntityName',
    width: 300,
    formVisible: false,
    formEditable: false,
    filterable: false,
    dataType: 'string',
  },
  {
    title: t('routes.system.authorization.roleEntity.entityTypeTitle'),
    dataIndex: 'EntityType',
    width: 360,
    formVisible: false,
    formEditable: false,
    filterable: false,
    dataType: 'string',
  },
  {
    title: t('routes.system.authorization.roleEntity.operationTitle'),
    dataIndex: 'Operation',
    width: 100,
    formVisible: true,
    formEditable: true,
    filterable: true,
    required: true,
    dataType: 'enum',
    enumData: dataAuthOperationEnumSchema,
  },
  {
    title: t('entity.lockable.isLockedTitle'),
    dataIndex: 'IsLocked',
    width: 75,
    formVisible: true,
    formEditable: true,
    filterable: true,
    required: true,
    dataType: 'boolean',
    formSchema: {
      colProps: {
        // span: 12,
        xs: 24, // <576px
        sm: 24, // ≥576px
        md: 24, // ≥768px
        lg: 24, // ≥992px
        xl: 12, // ≥1200px
        xxl: 12, // ≥1600px
        // xxxl: 12, // ≥2000px 3.0
      },
    },
  },
  {
    title: t('entity.creationAudited.createdTimeTitle'),
    dataIndex: 'CreatedTime',
    width: 180,
    filterable: true,
    formVisible: true,
    formEditable: false,
    dataType: 'datetime',
  },
  {
    title: t('entity.updateAudited.updatedTimeTitle'),
    dataIndex: 'UpdatedTime',
    width: 180,
    filterable: true,
    formVisible: true,
    formEditable: false,
    dataType: 'datetime',
  },
  {
    title: t('entity.dataVersion.dataVersionTitle'),
    dataIndex: 'DataVersion',
    width: 200,
    filterable: true,
    formVisible: true,
    formEditable: false,
    dataType: 'integer',
  },
];
